<!DOCTYPE html>
<html>
<head>
    <title>dropdown list</title>
    <link rel="Stylesheet" href="../lib/css/j3.css" />
    <script type="text/javascript" src="../lib/js/j3.js"></script>
</head>
<body>
<p id='ctnr1' style="width:150px"></p>
<p id='log'></p>
<script type="text/javascript">
    j3.ready(function () {
        var items = new j3.List;
        items.insert({text:'c#'});
        items.insert({text:'javascript'});
        items.insert({text:'coffeescript'});
        new j3.DropdownList({ctnr:'ctnr1', items:items, value:'javascript',
            fill: 1,
            on : {
              change : function(sender, args){
                j3.$('log').innerHTML = ('oldValue: ' + args.oldValue + '<br />' + 'curValue: ' + args.curValue);
              }
            }
          });
    });
</script>
</body>
</html>
